<template>
    <div class="app-container">
        <levelbar></levelbar>
        <div class="main-content">
            <el-table :data="tableData" style="width: 100%" border>
                <el-table-column type="index" align="center" width="50" label="序号"></el-table-column>
                <el-table-column prop="name" align="center" label="收费项"></el-table-column>
                <el-table-column prop="baseMonthPrice" align="right" label="月底价/元" header-align="center">
                    <template scope="scope">
                        {{scope.row.baseMonthPrice | moneySwitch}}
                    </template>
                </el-table-column>
                <el-table-column prop="baseHalfYearPrice" align="right" label="半年底价/元" header-align="center">
                    <template scope="scope">
                        {{scope.row.baseHalfYearPrice | moneySwitch}}
                    </template>
                </el-table-column>
                <el-table-column prop="baseYearPrice" align="right" label="年底价/元" header-align="center">
                    <template scope="scope">
                        {{scope.row.baseYearPrice | moneySwitch}}
                    </template>
                </el-table-column>
                <el-table-column prop="marketMonthPrice" align="right" label="月市场指导价/元" header-align="center">
                    <template scope="scope">
                        {{scope.row.marketMonthPrice | moneySwitch}}
                    </template>
                </el-table-column>
                <el-table-column prop="marketHalfYearPrice" align="right" label="半年市场指导价/元" header-align="center">
                    <template scope="scope">
                        {{scope.row.marketHalfYearPrice | moneySwitch}}
                    </template>
                </el-table-column>
                <el-table-column prop="marketYearPrice" align="right" label="年市场指导价/元" header-align="center">
                    <template scope="scope">
                        {{scope.row.marketYearPrice | moneySwitch}}
                    </template>
                </el-table-column>
                <el-table-column prop="discount" align="center" label="对B采购折扣"></el-table-column>
                <el-table-column prop="date" align="center" label="操作">
                    <template scope="scope">
                        <el-button type="text" class="btn-success" @click="btnset(scope.row)">编辑</el-button>
                        <el-button type="text" class="btn-success" @click="btnget(scope.row)">查看</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>
    </div>
</template>

<script>
import Levelbar from '../layout/Levelbar';
import {listMembershipItem} from 'api/newVipApi';
export default {
    name: 'newVip',
    components: {
        Levelbar
    },
    data() {
        return {
            tableData: []
        };
    },
    created() {
        listMembershipItem().then(data => {
            this.tableData = data.data.content;
        })
    },
    methods: {
        btnset(v) {
            switch (v.name) {
                case '会员服务':
                    this.$router.push({path: `editVip/${v.pId}/${v.name}`});
                    break;
                case '空中课堂':
                    this.$router.push({path: `editclassroom/${v.pId}/${v.name}`});
                    break;
                case '考勤报平安':
                    this.$router.push({path: `editPeace/${v.pId}/${v.name}`});
                    break;
                case '报平安':
                    this.$router.push({path: `editPeace/${v.pId}/${v.name}`});
                    break;
                case '家校通':
                    this.$router.push({path: `editHomeContact/${v.pId}/${v.name}`});
                    break;
                case 'e直播':
                    this.$router.push({path: `editELive/${v.pId}/${v.name}`});
                    break;
                case '校园e直播':
                    this.$router.push({path: `editELive/${v.pId}/${v.name}`});
                    break;
                default:
                    break;
            }
        },
        btnget(v) {
            this.$router.push({path: `getCheck/${v.pId}/${v.name}`});
        }
    }
};
</script>
<style lang="scss" scoped>
.app-container {
    position: relative;
    padding: 20px 20px 10px;
    .main-content {
        position: relative;
        padding: 20px;
        background: #fff;
            box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
            -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
        .table-list {
            .table-box {
                margin-top:0;
                margin-bottom: 20px;
            }
        } 
    }
}
</style>